import React, { Component } from 'react';
import {
    Text,
    TouchableOpacity,
    View
} from 'react-native';
import DateTimePicker from 'react-native-modal-datetime-picker';
import { public_Style as styles } from '../../styles';
import fmt from './fmtDateUtil';




export default class Timeutil extends Component {
    state = {
        isDateTimePickerVisible: false,
    };

    _showDateTimePicker = () => this.setState({ isDateTimePickerVisible: true });

    _hideDateTimePicker = () => this.setState({ isDateTimePickerVisible: false });

    _handleDatePicked = (date) => {
        this.props.function(date);
        this._hideDateTimePicker();
    };

    render() {
        return (
            <View>
                <TouchableOpacity onPress={this._showDateTimePicker} activeOpacity={1}>
                    <Text style={styles.timechoose}>
                        {this.props.time === undefined ? '点击选择日期' : fmt(this.props.time, 'yyyy-MM-dd')}
                    </Text>
                </TouchableOpacity>
                <DateTimePicker
                    isVisible={this.state.isDateTimePickerVisible}
                    onConfirm={this._handleDatePicked}
                    onCancel={this._hideDateTimePicker}
                    datePickerModeAndroid={'calendar'}
                />
            </View>
        );
    }

}